<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>Title</title>
    <link rel="shortcut icon"  th:href="@{/static/favicon.ico}"/>
    <link rel="stylesheet" href="/layui/css/layui.css"  media="all">
    <script type="text/javascript" src="/layui/jquery-3.5.1.min.js"></script>
    <script src="/layui/layui.js" charset="utf-8"></script>
    <script>
        layui.use('upload', function() {
            var $ = layui.jquery
                , upload = layui.upload;
            var applicationId=$("#applicationId").val();
            //订票台账
            $("#log").on("click",function () {
                //alert("传输数据====="+applicationId)
                layer.open({
                    type: 2,
                    area: ['1000px','500px'],
                    content: '/management/ticketAccount?id='+applicationId,
                    btn: ['关闭'],
                    yes: function () {
                        layer.closeAll();
                    },
                    zIndex: layer.zIndex
                });
            })
            //出差申请表
            $("#logTrval").on("click",function () {
                layer.open({
                    type: 2,
                    area: ['1000px','500px'],
                    content: '/business-trip/applicationDetails?id='+applicationId,
                    btn: ['关闭'],
                    yes: function () {
                        layer.closeAll();
                    },
                    zIndex: layer.zIndex
                });
            })

            //酒店台账
            $("#logHotel").on("click",function () {
                //alert("id==========="+applicationId)
                layer.open({
                    type: 2,
                    area: ['1000px','500px'],
                    content: '/management/getHotelApplicationDetails?id='+applicationId,
                    btn: ['关闭'],
                    yes: function () {
                        layer.closeAll();
                    },
                    zIndex: layer.zIndex
                });
            })


        });
    </script>
    <style type="text/css">
         img{
            cursor: pointer;
            transition: all 0.6s;
        }
         img:hover{
            transform: scale(1.4);
        }
    </style>
</head>
<body>
<div style="margin: auto; width: 1100px">
<form class="layui-form" action="/reimbursement/submitReimbursement" type="post">
    <!--&lt;!&ndash;<fieldset class="layui-elem-field"  style="width: 50%;margin: auto;height:100px;padding-top: 30px">&ndash;&gt;-->
    <!--    <fieldset class="layui-elem-field"  style="width: 50%;margin: auto;height:100px;padding-top: 30px">-->
    <fieldset class="layui-elem-field"  style="width: 80%;height: 150px;margin: auto;padding-top: 30px">

        <legend>报销申请</legend>
        <div class="layui-inline">
            <label class="layui-form-label">申请人</label>
            <div class="layui-input-inline"  name="quiz1">
                <input type="text" th:value="${reimbursementApplication.staff.name}" lay-verify="required"  name="price_min" readonly="readonly" autocomplete="off" class="layui-input">
                <input type="hidden" th:value="${reimbursementApplication.staff.id}" name="userId" id="applicating_staff">
            </div>
        </div>

        <div class="layui-inline">
            <label class="layui-form-label">工号</label>
            <div class="layui-input-inline"  name="quiz1">
                <input type="text" th:value="${reimbursementApplication.staff.jobNumber}" lay-verify="required"  name="price_min" readonly="readonly" autocomplete="off" class="layui-input">
            </div>
        </div>


        <div class="layui-inline">
            <label class="layui-form-label">报销类型</label>
            <div class="layui-input-inline"  name="quiz1">
                <input type="text" th:value="${dictionary.value}" lay-verify="required"  name="price_min" readonly="readonly" autocomplete="off" class="layui-input">
                <input type="hidden" th:value="${dictionary.id}" name="dictionaryId" id="dictionaryId">
                <input type="hidden" th:value="${details}" name="applicationId" id="applicationId">
            </div>
        </div>
    </fieldset>
    <fieldset class="layui-elem-field"  style="width: 80%;margin: auto;padding-top: 30px">
        <legend>报销金额</legend>
        <div class="layui-form-item">

            <label class="layui-form-label">票价总额</label>
            <div class="layui-input-inline" style="width: 10%">
                <input type="text" id="aircrafTicket" th:value="${reimbursementApplication.aircrafTicket}" readonly="readonly" lay-verify="number" name="aircrafTicket" placeholder="￥" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">单位：元</div>
            <!--订票台账-->
        <div class="layui-inline" th:if="${dictionary.id==19}">
            <div class="layui-input-inline">
                <button type="button" id="log" class="layui-btn">查看台账</button>
            </div>
        </div>
            <!--出差申请表-->
        <div class="layui-inline" th:if="${dictionary.id==20}">
            <div class="layui-input-inline">
               <button type="button" id="logTrval" class="layui-btn">查看详情</button>
            </div>
        </div>
            <!--酒店台账-->
        <div class="layui-inline" th:if="${dictionary.id==38}">
            <div class="layui-input-inline">
                <button type="button" id="logHotel" class="layui-btn">查看入住</button>
            </div>
        </div>


        </div>
    </fieldset>
    <!--同意人员-->
    <fieldset class="layui-elem-field" th:if="${reimbursementApplication.enable==2}"  style="width: 80%;height: 150px;margin: auto;padding-top: 30px">
        <legend>审批人员</legend>
        <div class="layui-inline">
            <label class="layui-form-label">姓名</label>
            <div class="layui-input-inline"  name="quiz1">
                <input type="text" th:value="${reimbursementApplication.updateStaff.name}" lay-verify="required"  name="price_min" readonly="readonly" autocomplete="off" class="layui-input">
                <input type="hidden" th:value="${reimbursementApplication.staff.id}" name="userId" >
            </div>
        </div>

        <div class="layui-inline">
            <label class="layui-form-label">工号</label>
            <div class="layui-input-inline"  name="quiz1">
                <input type="text" th:value="${reimbursementApplication.updateStaff.jobNumber}" lay-verify="required"  name="price_min" readonly="readonly" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-inline">
            <label class="layui-form-label">审批时间</label>
            <div class="layui-input-inline"  name="quiz1">
                <input type="text" th:value="${#dates.format(reimbursementApplication.updateTime,'yyyy-MM-dd')}" lay-verify="required"  name="price_min" readonly="readonly" autocomplete="off" class="layui-input">
            </div>
        </div>

    </fieldset>

    <fieldset class="layui-elem-field"  style="width: 80%;margin: auto;padding-top: 30px">
        <legend>备注</legend>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label"></label>
            <div class="layui-input-block">
                <textarea placeholder="无备注" th:text="${reimbursementApplication.remark}" readonly="readonly"  name="remark" class="layui-textarea"></textarea>
            </div>
        </div>
    </fieldset>

    <!--驳回人员-->
    <fieldset class="layui-elem-field" th:if="${reimbursementApplication.enable==0}" style="width: 80%;margin: auto;padding-top: 30px">
        <legend>驳回信息</legend>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">驳回理由</label>
            <div class="layui-input-block">
                <textarea placeholder="无备注" th:text="${reimbursementApplication.rejectRemark}" readonly="readonly"  name="rejectRemark" class="layui-textarea"></textarea>
            </div>
        </div>

        <div class="layui-inline">
            <label class="layui-form-label">驳回时间</label>
            <div class="layui-input-inline"  name="quiz1">
                <input type="text" th:value="${#dates.format(reimbursementApplication.updateTime,'yyyy-MM-dd')}" lay-verify="required"  name="price_min" readonly="readonly" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item layui-form-text">
            <div class="layui-inline">
                <label class="layui-form-label">驳回人</label>
                <div class="layui-input-inline"  name="quiz1">
                    <input type="text" th:value="${reimbursementApplication.updateStaff.name}" lay-verify="required"  name="price_min" readonly="readonly" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>

        <div class="layui-form-item layui-form-text">

            <div class="layui-inline">
                <label class="layui-form-label">驳回人工号</label>
                <div class="layui-input-inline"  name="quiz1">
                    <input type="text" th:value="${reimbursementApplication.updateStaff.jobNumber}" lay-verify="required"  name="price_min" readonly="readonly" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>

    </fieldset>

</form>

    <fieldset  class="layui-elem-field  site-demo-button" th:if="${invoicePictureList!=null}" style="width: 80%;margin: auto;padding-top: 30px">
        <legend>实物发票</legend>
        <div th:each="invoicePicture:${invoicePictureList}" class="layui-form-item" style="padding-left:3%">
                        <div class="layui-inline">
                            <label class="layui-form-label"></label>
                            <div class="layui-input-inline">
                                <img th:src="@{'/image/reimbursementBill/'+${invoicePicture.name}}"  style="width: 600px;height: 200px;"/>
                            </div>
                        </div>
        </div>
    </fieldset>

</div>
</body>
</html>